import "./index.scss";
import { Card, message } from "antd";
import { Button, Checkbox, Form, Input } from "antd";
import logo from "@/assets/logo.png";
import { useDispatch, useSelector } from "react-redux";
import { fechLogin } from "@/store/models/user";
import { replace, useNavigate } from "react-router-dom";
function Login() {
  const navaGator = useNavigate()
  // 操作store数据
  const dispatch = useDispatch()
  //读取store中的数据
  const user = useSelector((state) => state.login);
  const onFinish =async (e) => {
    // console.log(e, "llllllllllllll");
   const res= await dispatch(fechLogin(e))
    console.log(res, "res");
    if(res == 'OK'){
      message.success('登录成功')
      navaGator('/layout',{replace:true})
    }
  };
  return (
    <div className="loginBigbox">
      {/* {user.tooken} */}
      <Card
        variant="borderless"
        style={{
          width: 500,
          position: "absolute",
          left: "50%",
          top: "50%",
          transform: "translate(-50%,-50%)",
        }}
      >
        <div className="header">
          <img src={logo} alt="" style={{ height: "30px" }} />
        </div>

        <Form
          validateTrigger="onBlur"
          name="basic"
          labelCol={{ span: 8 }}
          wrapperCol={{ span: 16 }}
          style={{ maxWidth: 400 }}
          initialValues={{ remember: true }}
          onFinish={onFinish}
          //   onFinishFailed={onFinishFailed}
          autoComplete="off"
        >
          <Form.Item
            label="用户名"
            name="mobile"
            rules={[
              {
                required: true,
                defaultField: [blur],
                message: "请输入用户名！",
              },
              {
                pattern: /^1[3-9]\d{9}$/,
                message: "用户名格式不正确！",
              },
        
            ]}
          >
            <Input placeholder="请输入用户名" />
          </Form.Item>

          <Form.Item
            label="密码"
            name="code"
            rules={[{ required: true, message: "请输入密码！" }]}
          >
            <Input.Password placeholder="请输入密码" />
          </Form.Item>

          <Form.Item name="remember" valuePropName="checked" label={null}>
            <Checkbox>Remember me</Checkbox>
          </Form.Item>

          <Form.Item label={null}>
            <Button type="primary" htmlType="submit">
              Submit
            </Button>
          </Form.Item>
        </Form>
      </Card>
    </div>
  );
}

export default Login;
